<div class="ibox ">
    <div class="ibox-title">
        <h5>
            <vc:i18n name="费用信息" namespace="viewMainFee"></vc:i18n>
        </h5>
        <div class="ibox-tools" style="top:10px;">
            <button type="button" class="btn btn-primary btn-sm" style="margin-left:10px"
                v-on:click="_openCallBackOwner()">
                <vc:i18n name="返回"></vc:i18n>
            </button>
        </div>
    </div>
    <div class="ibox-content">
        <div class="row">
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用ID：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.feeId}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用标识：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.feeFlagName}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用类型：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.feeTypeCdName}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="付费对象：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.payerObjName}}
                        <span @click="_viewRoomData()" v-if="mainFeeInfo.payerObjType == '3333'">
                            <vc:create path="property/viewRoomData"></vc:create>
                        </span>
                    </label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用项：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="hand" @click="_viewFeeConfig()">{{mainFeeInfo.feeName}}
                        <span>
                            <vc:create path="property/viewFeeConfigData"></vc:create>
                        </span>
                    </label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用状态：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.stateName}}</label>
                </div>
            </div>


            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="建账时间：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.startTime}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="计费开始时间：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{_getEndTime(mainFeeInfo)}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="计费结束时间：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{_getDeadlineTime(mainFeeInfo)}}</label>
                </div>
            </div>

            <div class="col-sm-3" v-if="mainFeeInfo.amount != '-1.00'">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="费用金额：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.amount}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="批次：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.batchId}}</label>
                </div>
            </div>

            <template v-for="(item,index) in mainFeeInfo.feeAttrs">
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">{{item.specCdName}}：</label>
                        <label class="">{{item.value}}</label>
                    </div>
                </div>

            </template>
        </div>
        <div class="row" v-if="mainFeeInfo.payerObjType == '3333'">
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="面积：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.builtUpArea}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="单价：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.squarePrice}}</label>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="附加费：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.additionalAmount}}</label>
                </div>
            </div>
        </div>
        <div class="row" v-else>
            <div class="col-sm-3">
                <div class="form-group">
                    <label class="col-form-label">
                        <vc:i18n name="固定费：" namespace="viewMainFee"></vc:i18n>
                    </label>
                    <label class="">{{mainFeeInfo.additionalAmount}}</label>
                </div>
            </div>
        </div>

    </div>
</div>